import React, { useState } from "react";

export interface UIButtonProps {
  msg: '开始' | '暂停' | '重来' | '刷新'
  cbButton: (msg: '开始' | '暂停' | '重来' | '刷新') => void
}

export const UIButton: React.FC<UIButtonProps> = (props) => {

  const [color, setcolor] = useState('tomato')

  return (
    <button onClick={(e) => {
      props.cbButton(props.msg)
    }}
    style={{
      backgroundColor: color,
      border: '1px',
      marginTop: '15px',
      marginLeft: '2%',
      color: 'white'
    }}

    onMouseOver={() => {
      setcolor('#a35e5e')
    }}

    onMouseLeave={() => {
      setcolor('tomato')
    }}
    >
      {props.msg}
    </button>
  )
}